<template>
	<!-- 保养执行 -->
	<cardTemplate :loading="loading" :opt="cardSetting" title="工单评分" :isShowCapsule="false" :isShowTabs="false"
		:setTime="filter" @filterFun="getFilterFun" name="workScore" :safeAreaBottom="safeAreaBottom">
		<defaultBlock v-if="filter.type == 1 && scoreOpt.count == 0"></defaultBlock>
		<view class="card-content" v-else>
			<!-- 饼图start -->
			<view class="ring">
				<l-echart class="ring" ref="scoreOpt"></l-echart>
			</view>

			<view class="chart-total" v-if="filter.type == 1">
				<view class="chart-total-count">
					已评分工单总数:
					<text>{{ scoreOpt.count }}单</text>
				</view>
				<view class="chart-total-detail">
					<view @click="toMaintenanceList({ key: 'sign', value: [4], scoreState: 1 })"
						v-if="memberList.length > 0 || userList.length > 1">
						详情
						<image src="@/static/images/right.png" mode=""></image>
					</view>
				</view>
			</view>
			<!-- 饼图end -->

			<view class="title" style="margin-bottom: 0; font-size:28rpx;" v-if="memberList.length > 0">工单评分对比</view>
			<view class="chart-block" style="height: 480rpx;margin-bottom: 30rpx;"
				v-if="filter.type == 1 && memberList.length > 0">

				<l-echart class="ring" ref="scoreBar"></l-echart>
			</view>
			<!-- 条形图end -->
			<view class="chart-total" v-if="filter.type == 1 && memberList.length > 0">
				<view class="chart-total-count">
					已评分工单总数:
					<text>{{ scoreOpt.count }}单</text>
				</view>
			</view>
			<view class="title-d" v-if="filter.type == 1">
				<text>工单评分明细</text>
				<view class="key-setting" v-if="userList.length > 1" @click="showKeysSelect('scoreOpt')">
					<uni-icons type="gear" style="margin-right: 4rpx;"></uni-icons>
					指标设置
				</view>
			</view>
			<view class="data-types" v-if="userList.length && userList.length > 1">
				<sTabs v-if="filter.type == 1 && memberList.length > 1" @change="changeTab('scoreOpt', $event)"
					:list="typeList" :idx="scoreOpt.typeIdx"></sTabs>
			</view>
			<!-- 个人 -->
			<s-table :title="'工单评分 '" :headers="scoreOpt.leaderHead" :dataList="scoreOpt.userRecords"
				v-if="filter.type == 1 && userList.length == 1"
				@toContractDetail="toMaintenanceList({ key: 'sign', value: [4], scoreState: 1 })"></s-table>
			<!-- 小组 -->
			<s-table :title="title" @toContractDetail="toContractDetail($event, scoreOpt.typeIdx)"
				:dataList="scoreOpt.typeIdx == 0 ? scoreOpt.groupRecords : scoreOpt.userRecords"
				:headers="scoreOpt.leaderHead"
				v-if="filter.type == 1 && userList.length && userList.length > 1"></s-table>
		</view>

		<tagSelect ref="tagSelect" @success="changeTags"></tagSelect>
	</cardTemplate>
</template>

<script>
import * as echarts from '@/subpages/components/lime-echart/static/echarts.min';
import LEchart from '@/subpages/components/lime-echart/components/l-echart/l-echart.vue';
import cardTemplate from '../components/card-template/card-template.vue';
import totals from '../components/card-template/totals.vue';
import {  setRingOpt, setBarOpt } from './chartSet.js';
import { getLastDates } from '@/utils/tools.js';
import defaultBlock from '../components/default.vue';
import sTable from '../../components/s-table/s-table.vue';
import sPicker from '../../components/s-picker/s-picker.vue';
import sTabs from '../components/tabs.vue';
import tagSelect from './../components/tag-select.vue';
import { getWorkScoreChar, getWorkScoreCharUser, getWorkScoreCharDept, getWorkDetailedUser, getWorkDetailedDept } from '@/apis/statistic.js';
export default {
	name: 'workScore',
	components: { LEchart, cardTemplate, totals, defaultBlock, sTable, sPicker, sTabs, tagSelect },
	props: {
		title: {
			type: [  String],
			default: ''
		},
		groupId: [String, String],
		memberList: {
			type: Array,
			default: () => []
		},
		userList: {
			type: Array,
			default: () => []
		},
		pageScrollTop: {
			type: [Number, String],
			default: 0
		},
		childDeep: {
			type: [Number, String],
			default: 0
		},
		safeAreaBottom: {
			type: [Number, String],
			default: 0
		}
	},
	data() {
		return {
			loading: false, // 加载中
			cardSetting: {
				titleTips: {
					show: false,
					content: ''
				}
			},
			// dateTypes: ['按日', '按周', '按月'],
			filter: {
				type: 1, // 统计类型 1数量，2趋势
				dateType: 2, // 日期范围 1今天，2近七天，3近30天，4自定义日期
				startTime: '',
				endTime: '',
				useType: 0
			},
			typeList: ['按组', '按人'],
			groupList: ['整体趋势', '趋势对比'],
			barChart: setBarOpt({ color: ['#6FA9FF'] }),
			workScoring: {
				// 签到签退

				hasData: false,
				typeIdx: 0, // 0按组 1按人
				dateType: 0,
				type: 1, // 1按组统计，2按人统计
				lineType: 0, // 0整体趋势 1趋势对比
				tagIdx: 0,
				lineTypeGroup: [], // 选中的组
				lineTypeMbs: [], // 选中的人
				tags: [
					{ name: '0-60分', key: 'value1', unit: '次' },
					{ name: '60-80分', key: 'value2', unit: '次' },
					{ name: '80-100分', key: 'value3', unit: '次' },
					{ name: '100分以上', key: 'value4', unit: '次' }
				],
				count: 0,
				linedata: {
					categories: [],
					series: []
				},
				userHead: [
					{
						name: '签到签退状态', // 表头名称
						sort: false, // 是否开启该列的排序功能
						width: 240, // 列宽
						key: 'name', // 显示哪个字段
						checked: true,
						unit: '' // 单位
					},
					{
						name: '数量',
						sort: false,
						width: 210,
						checked: true,
						key: 'data'
					},
					{
						name: '占比',
						sort: false,
						checked: true,
						width: 225,
						key: 'ratio',
						unit: '%'
					}
				],
				leaderHead: [
					{
						name: '租户名称', // 表头名称
						sort: false, // 是否开启该列的排序功能
						checked: true,
						width: 210, // 列宽
						key: 'name', // 显示哪个字段
						unit: '' // 单位
					},
					{
						name: '平均分',
						sort: true,
						checked: true,
						width: 140,
						key: 'divScore'
					},
					{
						name: '0-60分',
						sort: true,
						checked: true,
						width: 155,
						key: 'value1',
						unit: ''
					},
					{
						name: '60-80分',
						sort: true,
						checked: true,
						width: 155,
						key: 'value2',
						unit: ''
					},
					{
						name: '80-100分',
						sort: true,
						checked: true,
						width: 175,
						key: 'value3',
						unit: ''
					},
					{
						name: '100分以上',
						sort: true,
						checked: true,
						width: 175,
						key: 'value4',
						unit: ''
					}
				],
				chartData: {
					series: []
				},
				groupRecords: [], // 组明细
				userRecords: [] // 人明细
			},

			scoreOpt: {
				colors: ['#6fa9ff', '#87dde7', '#B59CFE', '#fbcb92'],
				opts: {},
				count: 0,
				totals: {},
				// 保养作业时长配置
				hasData: false,
				typeIdx: 0, // 0按组 1按人
				dateType: 0,
				// ringOpt:setRingOpt({ tofix: 1 }),
				typeList: ['按组', '按人'],
				type: 1, // 1按组统计，2按人统计
				lineType: 0, // 0整体趋势 1趋势对比
				tagIdx: 0,
				lineOpt: {},
				barOpt: {},
				lineTypeGroup: [], // 选中的组
				lineTypeMbs: [], // 选中的人
				tags: [
					{ name: '0-60分', key: 'value1', unit: '次' },
					{ name: '60-80分', key: 'value2', unit: '次' },
					{ name: '80-100分', key: 'value3', unit: '次' },
					{ name: '100分以上', key: 'value4', unit: '次' }
				],
				userHead: [
					{
						name: '签到签退状态', // 表头名称
						sort: false, // 是否开启该列的排序功能
						width: 240, // 列宽
						key: 'name', // 显示哪个字段
						checked: true,
						unit: '' // 单位
					},
					{
						name: '数量',
						sort: false,
						width: 210,
						checked: true,
						key: 'data'
					},
					{
						name: '占比',
						sort: false,
						checked: true,
						width: 225,
						key: 'ratio',
						unit: '%'
					}
				],
				leaderHead: [
					{
						name: '租户名称', // 表头名称
						sort: false, // 是否开启该列的排序功能
						checked: true,
						width: 210, // 列宽
						key: 'name', // 显示哪个字段
						unit: '' // 单位
					},
					{
						name: '平均分',
						sort: true,
						checked: true,
						width: 140,
						key: 'divScore'
					},
					{
						name: '0-60分',
						sort: true,
						checked: true,
						width: 155,
						key: 'value1',
						unit: ''
					},
					{
						name: '60-80分',
						sort: true,
						checked: true,
						width: 155,
						key: 'value2',
						unit: ''
					},
					{
						name: '80-100分',
						sort: true,
						checked: true,
						width: 175,
						key: 'value3',
						unit: ''
					},
					{
						name: '100分以上',
						sort: true,
						checked: true,
						width: 175,
						key: 'value4',
						unit: ''
					}
				],
				linedata: {
					categories: [],
					series: []
				},
				chartData: {
					series: []
				},
				groupRecords: [], // 组明细
				userRecords: [] // 人明细
			}
		};
	},
	async created() {
		// 近七天
		const dates = getLastDates(30); // 默认近七天
		this.filter.startTime = dates.startTime;
		this.filter.endTime = dates.endTime; 
	},
	watch: { 
	},
	methods: {
		setRingChart(chart) {  // 绘制环形图
			let list = this[chart].chartData.series;
			let chartData = [];
			for (let i = 0; i < list.length; i++) {
				chartData.push({
					value: list[i].data, name: list[i].name
				});
			}
			this[chart].opts = setRingOpt({ color: this[chart].colors, data: chartData });
			this.$nextTick(() => {
				this.$refs[chart].init(echarts, chartF => {
					// this.chartMaps[chart] = chartF 
					chartF.setOption(this[chart].opts);

					chartF.dispatchAction({
						type: 'highlight',
						seriesIndex: 0,
						dataIndex: 0
					});
					chartF.on('legendselectchanged', (e) => { 
						chartF.dispatchAction({ type: 'downplay', seriesIndex: 0 }); // 处理图例点击导致选中与默认选中重叠问题
					});
					chartF.on('mouseover', (e) => {
						if (e.dataIndex !== 0) { // 当鼠标移除的时候 使默认的索引值去除默认选中
							chartF.dispatchAction({ type: 'downplay', dataIndex: 0 });
						}
					});
				});
			});
		},
		setDataFuc(key) {
			// console.log('修改数据源',this.filter);
			this.groupModel = this.findRoute('data_change');

			if (!this.filter.startTime) {
				const dates = getLastDates(7);
				this.filter.startTime = dates.startTime;
				this.filter.endTime = dates.endTime;
			}
			uni.getStorage({
				key: 'statistical' + (this.childDeep ? this.childDeep : ''),
				success: res => {
					this.userList = res.data.id.split(',');
					this.groupId = res.data.groupId;
					this.memberList = res.data.groupList || [];
					this.title = res.data.title;
					if (res.data.score) {
						this.filter = res.data.score;
						console.log(this.filter, 6666);
					} else {
						this.filter = res.data.filter;
					}
					this.initData();
				}
			});
		},
		// 工单评分值饼图占比
		initGetWorkScoreChar() {
			getWorkScoreChar({
				beginDate: this.filter.startTime,
				endDate: this.filter.endTime,
				userIds: this.userList
			}).then(res => {
				// console.log('initGetWorkScoreChar工单评分饼图饼图', res);
				this.scoreOpt.count = res.data.orderTotal || 0;
				this.scoreOpt.chartData.series = [
					{ name: '0-60分', data: Number(res.data.value1), ratio: Number(res.data.value1 * 100).toFixed(1) },
					{ name: '60-80分', data: Number(res.data.value2), ratio: Number(res.data.value2 * 100).toFixed(1) },
					{ name: '80-100分', data: Number(res.data.value3), ratio: Number(res.data.value3 * 100).toFixed(1) },
					{ name: '100分以上', data: Number(res.data.value4), ratio: Number(res.data.value4 * 100).toFixed(1) }
				];
				if (this.scoreOpt.count > 0) {
					this.setRingChart('scoreOpt');
				}
				this.loading = false;
			});
		},
		// 修改筛选条件
		getFilterFun(res) {
			if (!this.userList.length) {
				return;
			}
			// console.log('修改筛选条件-status', res);
			if (res.applyToAll) {
				this.$emit('applyToAll', res);
			}
			this.filter = res;
			this.initData();
		},
		// 获取评分详情
		getRingDatas() {
			let users = [];
			for (let i = 0; i < this.userList.length; i++) {
				users.push({
					id: this.userList[i]
				});
			}
			let arr = [];
			let arrTwo = [];

			for (let i = 0; i < this.memberList.length; i++) {
				let item = {
					id: i == this.memberList.length - 1 ? 1 : this.memberList[i].id,
					item: []
				};
				let itemTwo = {
					deptId: i == this.memberList.length - 1 ? 1 : this.memberList[i].id,
					deptName: this.memberList[i].name,
					userIds: []
				};
				for (let j = 0; j < this.memberList[i].children.length; j++) {
					item.item.push({
						id: this.memberList[i].children[j].id
					});
					itemTwo.userIds.push(this.memberList[i].children[j].id);
				}
				arr.push(item);
				arrTwo.push(itemTwo);
			}
			// console.log(this.memberList,"this.memberList");
			if (this.memberList.length == 1) {
				// 工单评分明细-按人
				getWorkDetailedUser({
					userIds: this.userList,
					beginDate: this.filter.startTime,
					endDate: this.filter.endTime
				}).then(res => {
					console.log('工单评分明细-按人', res);
					if (res.code === 200) {
						const groupsWork = res.data || [];
						let chart_group6 = [];
						for (let i = 0; i < groupsWork.length; i++) {
							chart_group6.push({
								name: groupsWork[i].name,
								divScore: Number(groupsWork[i].divScore),
								value1: groupsWork[i].value1,
								value2: groupsWork[i].value2,
								value3: groupsWork[i].value3,
								value4: groupsWork[i].value4
							});
						}
						this.setGeoupData(chart_group6, 'scoreOpt');
						// console.log(chart_group6,"按人数据表格")
					}
				});
				// 工单评分对比-按人
				getWorkScoreCharUser({
					userIds: this.userList,
					beginDate: this.filter.startTime,
					endDate: this.filter.endTime
				}).then(res => {
					if (res.code === 200) {
						const obj = res.data || {};
						this.scoreOpt.linedata.categories = (obj.scoreItems || []).map(item => item.name);
						let scoreItems = obj.scoreItems || [];

						this.scoreOpt.linedata.series = [
							{
								data: (obj.scoreItems || []).map(item => item.value1),
								name: '已评分工单数',
								radios: (obj.scoreItems || []).map(item => Number(item.value2 * 100).toFixed(1)),
								unit: '单'
								// show:false,
							}
						];
						this.setLineChart('scoreOpt');
						console.log('工单评分对比-按人', this.scoreOpt.linedata);
					}
				});
			} else if (this.memberList.length > 1) {
				// 工单评分明细-按组
				getWorkDetailedDept({
					deptGroups: arrTwo,
					beginDate: this.filter.startTime,
					endDate: this.filter.endTime
				}).then(res => {
					console.log('工单评分明细-按组', res);
					if (res.code === 200) {
						const groupsWork = res.data || [];
						let chart_group6 = [];
						for (let i = 0; i < groupsWork.length; i++) {
							chart_group6.push({
								name: groupsWork[i].name,
								divScore: Number(groupsWork[i].divScore),
								value1: groupsWork[i].value1,
								value2: groupsWork[i].value2,
								value3: groupsWork[i].value3,
								value4: groupsWork[i].value4
							});
						}
						this.setGeoupData(chart_group6, 'scoreOpt');
					}
				});
				// 工单评分对比-按组
				getWorkScoreCharDept({
					deptGroups: arrTwo,
					beginDate: this.filter.startTime,
					endDate: this.filter.endTime
				}).then(res => {
					const obj = res.data || {};
					this.scoreOpt.linedata.categories = (obj.scoreItems || []).map(item => item.name);
					let scoreItems = obj.scoreItems || [];

					this.scoreOpt.linedata.series = [
						{
							data: (obj.scoreItems || []).map(item => item.value1),
							name: '已评分工单数',
							radios: (obj.scoreItems || []).map(item => Number(item.value2 * 100).toFixed(1)),
							unit: '单'
							// show:false,
						}
					];
					this.setLineChart('scoreOpt');
					console.log('工单评分对比-按zu', this.scoreOpt.linedata);
				});
			} else {
				// 工单评分明细-按人
				getWorkDetailedUser({
					userIds: this.userList,
					beginDate: this.filter.startTime,
					endDate: this.filter.endTime
				}).then(res => {
					console.log('工单评分明细-按人', res);
					if (res.code === 200) {
						const groupsWork = res.data || [];
						let chart_group6 = [];
						for (let i = 0; i < groupsWork.length; i++) {
							chart_group6.push({
								name: groupsWork[i].name,
								divScore: Number(groupsWork[i].divScore),
								value1: groupsWork[i].value1,
								value2: groupsWork[i].value2,
								value3: groupsWork[i].value3,
								value4: groupsWork[i].value4
							});
						}
						// this.scoreOpt.userRecords = chart_group6;
						this.setGeoupData(chart_group6, 'scoreOpt');
					}
				});
			}
		},
		// 绘制趋势折现图
		setLineChart(chart) {  // 绘制环形图
			let list = this[chart].linedata.series;
			let chartData = [];
			for (let i = 0; i < list.length; i++) {
				let seriesItem = {
					name: list[i].name,
					type: 'bar',
					data: list[i].data,
					showSymbol:list[i].data.length <= 1 ? true : false,
				};

				chartData.push(seriesItem);
			}
			this[chart].barOpt = this.serBarOpt({ series: chartData, category: this[chart].linedata.categories });
			console.log(this[chart].barOpt);
			this.$nextTick(() => {
				if (this.$refs['scoreBar']) {
					this.$refs['scoreBar'].init(echarts, chartF => {
					// this.chartMaps[chart] = chartF 
						chartF.setOption(this[chart].barOpt);
					});
				}
			});
		},
		// 工单评分明细-按人
		handGetWorkDetailedUser() {
			uni.showLoading({
				title: '加载中',
				mask: true
			});
			getWorkDetailedUser({
				userIds: this.userList,
				beginDate: this.filter.startTime,
				endDate: this.filter.endTime
			}).then(res => {
				console.log('getWorkDetailedUser', res);
				if (res.code === 200) {
					uni.hideLoading();
					const usersWork = res.data || [];
					let chart_users6 = [];
					for (let i = 0; i < usersWork.length; i++) {
						chart_users6.push({
							name: usersWork[i].name,
							divScore: Number(usersWork[i].divScore),
							value1: usersWork[i].value1,
							value2: usersWork[i].value2,
							value3: usersWork[i].value3,
							value4: usersWork[i].value4
						});
					}
					this.setGeoupData(chart_users6, 'scoreOpt');
				}
			});
		},

		serBarOpt(data) {
			return {

				tooltip: {
					trigger: 'axis',
					axisPointer: {
						type: 'line',
						label: {
							backgroundColor: '#6a7985'
						}
					},
					position: function (pos, params, el, elRect, size) {
						var obj = { top: 'auto' };
						obj[['left', 'right'][+(pos[0] < size.viewSize[0] / 2)]] = 30;
						return obj;
					},
				},
				legend: {
					show: false
				},
				grid: {
					top: '15',
					left: '3%',
					right: '4%',
					bottom: '3%',
					containLabel: true
				},
				xAxis: {
					type: 'value',
					lineStyle: {
						type: 'dashed'// 虚线
					},
					axisTick: {
						show: false,

					},
					axisLine: {
						show: true,
						lineStyle: {
							color: '#999'
						},
					},
					axisLabel: {
						textStyle: {
							color: '#999',
						},
					},
				},
				yAxis: {
					type: 'category',
					data: data.category,
					axisTick: {
						show: false,

					},
					axisLine: {
						show: true,
						lineStyle: {
							color: '#999'
						},
					},
					axisLabel: {
						textStyle: {
							color: '#999',
						},
					},
				},
				series: data.series
			};
		},
		// 表格点击事件
		toContractDetail(res, typdIdx) {
			const { item, key } = res;
			console.log(item, key, typdIdx);
			if (key == 'name' && this.memberList.length) {
				if (!this.memberList.length) {
					return;
				}
				// 数据下转
				let list = [];
				let groupId = '';
				if (this.memberList.length == 1) {
					list = this.memberList[0].children;
					groupId = this.memberList[0].id;
				} else {
					list = this.memberList;
				}
				if (typdIdx == 1 && this.memberList.length > 1) {
					// 按人对比 查询子集维保员
					for (let i = 0; i < list.length; i++) {
						for (let j = 0; j < list[i].children.length; j++) {
							if (list[i].children[j].name == item.name) {
								const storage = {
									groupId: this.groupId,
									id: list[i].children[j].id,
									title: item.name,
									score: {
										...this.filter
									}
								};
								this.toDeepPage(storage);
								return;
							}
						}
					}
				} else {
					// console.log(item, key, list);
					for (let i = 0; i < list.length; i++) {
						if (list[i].name == item.name) {
							if (list[i].type == 2) {
								// 人单位
								const storage = {
									groupId: groupId,
									id: list[i].id,
									title: item.name,
									score: {
										...this.filter
									}
								};
								this.toDeepPage(storage);
							} else {
								// 组单位
								groupId = list[i].id;
								let ids = [];
								list[i].children.forEach(item => {
									ids.push(item.id);
								});
								const storage = {
									groupId: groupId,
									id: ids.join(','),
									groupList: [list[i]],
									title: item.name,
									score: {
										...this.filter
									}
								};
								this.toDeepPage(storage);
							}
							return;
						}
					}
				}
			}
		},
		// 数据下转
		toDeepPage(data) {
			console.log('数据下转', data);
			data.filter = this.filter;
			data.tabNums = this.tabNums;
			uni.setStorage({
				key: 'statistical' + (Number(this.childDeep || 0) + 1),
				data: data,
				success: res => {
					uni.navigateTo({
						url: `./statistical?tabIdx=2&childDeep=${Number(this.childDeep || 0) + 1}`
					});
				},
				fail: err => {
					console.log(err);
				}
			});
		},
		// 初始化数据
		initData(data) {
			if (!this.userList.length) {
				return;
			}
			this.loading = true;
			if (data) {
				if (data.applyToAll) {
					this.filter.dateType = data.dateType;
					this.filter.startTime = data.startTime;
					this.filter.endTime = data.endTime;
				} else {
					this.filter = data;
				}
			}
			// 加载饼图数据
			this.initGetWorkScoreChar();
			this.getRingDatas();
			if (this.userList.length > 0) {
				// 按组数据
			} else {
				// 按人数据
			}
		},

		// 提取表格全部数据
		setGeoupData(arr, key) {
			// console.log(arr,999);
			let list = [];
			for (let i = 0; i < arr.length; i++) {
				if (arr[i].name == '全部') {
					this[key].totals = arr[i];
				} else {
					list.push(arr[i]);
				}
			}
			if (this.userList.length > 1) {
				if (this[key].typeIdx == 0) {
					this[key].groupRecords = list;
				} else {
					this[key].userRecords = list;
				}
			} else {
				this[key].userRecords = list;
			}
		},
		toMaintenanceList(res) {
			const { startTime, endTime, dateType } = this.filter;
			res.tabNums = [this.filter.useType];
			if (this.filter.useType === 2) {
				// 默认不传全部
				delete res.tabNums;
			}
			uni.navigateTo({
				url:
					'/subpages/maintenanceStatistics/index?data=' +
					JSON.stringify(startTime ? { ...res, startTime, endTime, dateType, childDeep: this.childDeep } : { ...res, childDeep: this.childDeep })
			});
		},
		formatterCenter(res) {
			console.log(res);
			let { ratio, name } = res;
			if (name && name.indexOf('分钟') != -1) {
				let arr = name.split('(');
				name = arr[0];
			}
			return {
				title: (res.data * 100).toFixed(1) + '%',
				subtitle: name
			};
		},
		changeTab(key, idx) {
			console.log('changeTab,按人按组', key, idx);
			this[key].typeIdx = idx;
			if (idx == 1) {
				this.handGetWorkDetailedUser();
			}
		},
		showKeysSelect(key) {
			this.$refs.tagSelect.init({
				tags: this[key].leaderHead,
				key: key
			});
		},
		// 自定义表格字段
		changeTags(res) {
			console.log('自定义表格字段', res);
			this[res.key].leaderHead = res.tags;
			// this.$forceUpdate()
		},
		setDefGroup(key) {
			if (this[key].type == 1) {
				// 按组对比，设置默认组数据
				if (this[key].lineTypeGroup.length) {
					// 检查是否有已选数据
				} else {
					let groups = [];
					for (let i = 0; i < this.memberList.length; i++) {
						groups.push(this.memberList[i].id);
					}
					if (groups.length > 5) {
						groups = groups.slice(0, 5);
					}
					this[key].lineTypeGroup = groups;
				}
			} else {
				// 按人对比，设置人默认数据
				if (this[key].lineTypeMbs.length) {
					// 检查是否有已选数据
				} else {
					let mbs = JSON.parse(JSON.stringify(this.userList));
					if (mbs.length > 5) {
						mbs = mbs.slice(0, 5);
					}
					this[key].lineTypeMbs = mbs;
				}
			}
			console.log(this.timeOpt);
		}
	}
};
</script>

<style lang="scss" scoped>
@import './card.scss';

.key-setting {
	display: flex;
	justify-content: flex-end;
}

.ring {
	width: 100%;
	height: 400rpx;
}
</style>
